import React from 'react'

import { Button, Input, List } from 'antd'

export default function AppUI (props) {
  return (
    <div style={{margin: '10px'}}>

      <Input 
        placeholder="Basic usage" 
        style={{width: '500px', marginRight: '10px'}}
        value={props.value}
        onChange={props.changeInput}
      />

      <Button 
        type="primary"
        onClick={props.addItem}
        >提交</Button>

      <List
        style={{marginTop: '10px', width: '500px'}}
        bordered
        dataSource={props.todolist}
        renderItem={item => (
          <List.Item onClick={() => {props.removeItem(item)} }>{item}</List.Item>
        )}
      />

    </div>
  )
}